<template>
    <el-main>
      <div class="bg-white grid-content">
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item>
          <el-button type="primary"  @click="handAudit()">审核</el-button>

        </el-form-item>

      </el-form>
    </div>
      <!-- 数据表格 -->
      <el-table
        :data="tableData"
        border
        stripe
        style="width: 100%; margin-bottom: 10px"
        :header-cell-style="{background:'#F5F7FA',color:'#909399'}"
      >
        <el-table-column 
            v-for="(item, index) in btList" 
            :key="index" 
            :label="item.lmc"
            :prop="item.zdmc"
            align="center">
            <el-table-column 
                v-for="(itemc, index) in item.children" 
                :key="index" 
                :label="itemc.lmc"
                :prop="itemc.zdmc"
                align="center">
                
            </el-table-column>
        </el-table-column>
        <!-- <el-table-column prop="fwdm" label="服务代码" align="center"></el-table-column>
        <el-table-column prop="fwlx" label="服务类型" align="center"></el-table-column>
        <el-table-column prop="fwmc" label="服务名称" align="center" width="600"></el-table-column> -->
      </el-table>

      <!-- 弹出框 -->
      <el-dialog title="数据审核" :visible.sync="dialogFormVisible" custom-class="saveAsDialog2">
        <el-form :inline="true" :model="Form" class="demo-form-inline" ref="Form" label-position="left" label-width="80px">
          <el-form-item label="审核:" >
            <el-select v-model="Form.approveStatus" placeholder="请选择审核状态">
              <!-- syjForm.approveStatus=='0'? syjForm.approveStatus == '未审核':syjForm.approveStatus=='1'?syjForm.approveStatus == '通过':syjForm.approveStatus == '不通过' -->
              <!-- <el-option label="未审核" value="1"></el-option> -->
              <el-option label="通过" value="1"></el-option>
              <el-option label="不通过" value="2"></el-option>
            </el-select>
          </el-form-item>

          <el-row>
              <el-form-item label="审核备注:">
                <el-input type="textarea" v-model="Form.approveBz" placeholder="请输入审核备注"></el-input>
              </el-form-item>
          </el-row>
        </el-form>

        <div slot="footer" class="dialog-footer">
          <el-button @click="shclose('Form')">取 消</el-button>
          <el-button type="primary" @click="submitForm('kgjForm')">确 定</el-button>
        </div>
      </el-dialog>
    </el-main>
  </template>
  
  <script>
  import dtbbApi from '@/api/dtbb/bbmb';
  import dtbbShApi from '@/api/dtbb/dtbb';
  import infoApi from "@/api/dtbb/info";
  // import GeneralQuery from '../components/GeneralQuery';
  import { getToken } from "@/utils/auth";
 
  export default {
    name: "dtbbList",
    // components:{
    //   GeneralQuery
    // },
    data() {
      return {
        dialogFormVisible: false,
        Form:{
          id:'',
          bbid:'',
          approveStatus:'',
          approveBz:'',
        },
        // table数据
        tableData: [],
        btList:[],//表头

        bbid:'',

        //查询条件SQL
        nativeSql:'',
        sqlId:'',
        currentApproveStatus:''
      };
    },
    methods: {
      //接收数据
      getinfo(){
        let geturl = window.location.href
        console.log(geturl);
        let listurl = geturl.split('=');
        this.bbid = listurl[1]
        // this.bbid =this.$route.query.bbid;
        console.log(this.bbid);
      },

      async searchByBbid() {
        //发送查询请求
        let res = await dtbbShApi.getByBbid({bbid:this.bbid});
        //判断是否成功
        if(res.success){
          console.log(res.data);
          this.sqlId = res.data.id
          this.currentApproveStatus = res.data.approveStatus
        }
      },
      /**
      * 查询列表
      */
      async search() {
        //发送查询请求
        let res = await dtbbApi.getBbDataByQuery({bbid:this.bbid,isSH:1});
        //判断是否成功
        if(res.success){
          console.log(res.data);
          //赋值
          this.tableData = res.data;
          //总数量
          this.total = res.data.total;
        }
      },
      /**
     * 查询字段树形列表
     */
     async searchTreeListZd() {
      // this.pageNo = pageNo; //当前页码
      // this.pageSize = pageSize; //每页显示数量
      //发送查询请求
      let res = await infoApi.getTreeList({bbid:this.bbid});
      //判断是否成功
      if (res.success) {
        console.log(res.data);
        //赋值
        this.btList = res.data;
      }
    },
    handAudit(){
      if(this.currentApproveStatus == 1){
        this.$message.error('已通过审核');
      }else if(this.currentApproveStatus == 2){
        this.$message.error('已打回');
      }else{
        this.dialogFormVisible = true
      }
      
    },
    // 审核弹框关闭触发
    shclose(formName) {
        this.dialogFormVisible = false;
        this.$resetForm("Form", this.Form); //清空表单数据
      },

      //审核确认
     async submitForm(formName) {
                let res = null;
                this.Form.id = this.sqlId
                this.Form.bbid = this.bbid
                    //发送审核请求
                    console.log(this.Form)
                    res = await dtbbShApi.updateSQL(this.Form);

                console.log(res)
                //判断是否成功
                if (res.success) {
                    // this.$message.success(res.message);
                    this.$message({ message: '修改审核状态成功！', type: 'success' });
                    //刷新
                    this.search();
                    this.searchByBbid();
                    this.$resetForm("Form", this.Form); //清空表单数据
                    //关闭窗口
                    this.dialogFormVisible = false;
                } else {
                  console.log(res)
                    this.$message.error(res.message);
                }
      },
    
    
    download(){
      console.log(this.bbid);
      window.open("http://47.108.251.250:3296/api/dtbb/DownloadMyExcel?token=" + getToken() + '&bbid=' + this.bbid);
    }
    },
    //初始化时调用
    created() {
      this.getinfo();
    },
    //挂载后调用
    mounted() {
      this.search();
      this.searchByBbid();
      this.searchTreeListZd();
    },
  };
  </script>
  
  <style lang="scss" scoped>
  
  .tablestyle{
      display: flex;
      justify-content: center;
      align-items: center;
}
::v-deep .saveAsDialog2 {
    width: 25% !important;
  }

  .el-textarea{
    width: 105%;
  }
</style>
  